{namespace lfe=SGalinski\Lfeditor\ViewHelpers}

<f:layout name="Default" />

<f:section name="selectItems">
	<f:render partial="SelectExtensionAndLanguageFile" arguments="{_all}" />
	<div class="row">
		<f:form id="mainMenuForm" action="changeSelection">
			<f:render partial="SelectLanguageAndReference" arguments="{_all}" />
		</f:form>
	</div>
</f:section>

<f:section name="main">
	<f:if condition="{extensionSelection} && {languageFileSelection} && {languageSelection} && {fluidTree}">
		<div class="panel panel-default">
			<div class="panel-heading">
				<f:translate key="select.explodeToken" />
			</div>
			<div class="panel-body">
				<f:form id="contentForm" action="selectExplodeToken">
					<p>
						<f:form.textfield name="explodeToken" value="{explodeToken}" />
						<f:form.submit value="{f:translate(key:'select.explodeToken')}" />
					</p>
					<fieldset class="tx-lfeditor-fieldset bgColor5">
						<legend class="bgColor3">
							<f:translate key="function.const.treeview.treeview" />
						</legend>
						<p class="tx-lfeditor-goodMarkup">
							xyz -- <f:translate key="function.const.treeview.goodMarkupHint" />
						</p>
						<p class="tx-lfeditor-badMarkup">
							xyz -- <f:translate key="function.const.treeview.badMarkupHint" />
						</p>
						<p class="tx-lfeditor-specialMarkup">
							xyz -- <f:translate key="function.const.treeview.specialMarkupHint" />
						</p>
						<fieldset class="bgColor4">
							<legend class="bgColor3">
								<a href="javascript:TYPO3.lfEditor.hideUnHideAll()">
									<f:translate key="function.const.treeview.hideUnhideAll" />
								</a>
							</legend>

							<ul class="tx-lfeditor-treeview">
								<li>
									<a href="javascript:TYPO3.lfEditor.openCloseTreeEntry('{f:uri.resource(path: 'Icons')}', 'ul-Root', 'icon-Root', 1)">
										<img id="icon-Root"
											src="{f:uri.resource(path: 'Icons/{fluidTree.Root.icons.0.name}')}"
											alt="{fluidTree.Root.icons.0.name}"
											style="margin-left: {fluidTree.Root.icons.0.marginLeft}px;" />
										<f:translate key="function.const.treeview.root" />
									</a>
									<f:if condition="{fluidTree.Root.children}">
										<ul id="ul-Root" class="tx-lfeditor-treeview">
											<f:render partial="TreeElement"
												arguments="{fluidTree: '{fluidTree.Root.children}',  treeHide: '{treeHide}'}" />
										</ul>
									</f:if>
								</li>
							</ul>
						</fieldset>
					</fieldset>
				</f:form>
			</div>
		</div>
	</f:if>
</f:section>

<f:section name="ButtonBarLeft">
</f:section>
